<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>大纲</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="/layui/css/layui.css">
    <script src="/layui/layui.js"></script>
    <link rel="stylesheet" href="/css/main.css">
    <script src="/js/jquery-2.1.4.min.js"></script>


    <!--<link rel="stylesheet" href="/css/commonNav.css">-->
    <style>
        .main{
            overflow: hidden;
        }
        .left-container{
            float: left;
        }
        .right-content {
            float: left;
            width: 800px;
            margin-left: 10px;
        }

        ul.left-nav li {
            border-left-color: #23b8ff;
        }

        ul.left-nav li:hover {
            background-color: rgba(100, 100, 100, 0.3) !important;
        }

        ul.left-nav li.active {
            background-color: #eaeaea;
            border-left: 5px solid;
            border-left-color: #23b8ff;
        }

        ul.left-nav a {
            color: black !important;
        }

        ul.left-nav a:hover {
            color: #23b8ff !important;
        }

        .icon-cursor:hover {
            cursor: pointer;
        }
    </style>
</head>
<body class="lay-blog">
<div th:include="/teacher/templates::header"></div>

<div class="container-wrap" id="outline_form">

    <div class="container" style="width: 1100px;">
        <div class="main" style="">
            <div class="left-container " style="">
                <div class="left-container" style="">
                    <ul class="layui-nav layui-nav-tree left-nav"
                        style="background-color: white;color: black;"
                        lay-filter="test">
                        <li class="layui-nav-item"><a href="/teacher/outline/search.html">大纲查询</a></li>
                        <li class="layui-nav-item"><a href="/teacher/outline/template.html">大纲模板</a></li>
                        <li class="layui-nav-item active">
                            <a href="javascript:;">录入大纲</a>
                        </li>
                        <li class="layui-nav-item">
                            <a href="/teacher/outline/manage.html">我的大纲</a>
                        </li>
                    </ul>

                </div>

                <div class="right-content" style="">
                    <div style="padding: 20px 30px 20px 10px; background-color: white; margin-left: 10px;">
                        <form class="layui-form" style="font-size: 16px; width: 100%; padding: 10px;">
                            <div class="layui-form-item">
                                <label class="layui-form-label">选择年级</label>
                                <div class="layui-input-block" id="grade">
                                    <select name="grade" lay-verify="required" lay-filter="grade">
                                        <option value="" class="expected"></option>
                                        <option v-for="g in grade" :value="g.id">{{g.name}}</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">选择课程</label>
                                <div class="layui-input-block" id="course">
                                    <select name="course.id" lay-verify="required" lay-filter="course" lay-search>
                                        <option value="" class="expected"></option>
                                        <option v-for="c in courses" :value="c.id">{{c.name}}</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">大纲名称</label>
                                <div class="layui-input-block">
                                    <input type="text" name="name" required lay-verify="name" placeholder="请输入标题"
                                           autocomplete="off" class="layui-input">
                                </div>
                            </div>
                            <div style="margin-left: 110px;padding: 10px 0 25px 0;">
                                <button type="button" class="layui-btn" id="outlineFile">
                                    <i class="layui-icon">&#xe67c;</i>上传大纲
                                </button>
                            </div>
                            <div style="padding-left: 35px;">
                                <h3>预览</h3>
                                <table id="table1" class="layui-table" lay-filter="table1"></table>
                            </div>
                            <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">大纲参考</label>
                                <div class="layui-input-block">
                                    <textarea name="refer" placeholder="请输入内容" class="layui-textarea"></textarea>
                                </div>
                            </div>
                            <!-- 操作列 -->
                            <script type="text/html" id="oper-col">
                                <a class="layui-btn layui-btn-xs" lay-event="edit">修改</a>
                                <!--<a class="layui-btn layui-btn-xs" lay-event="del">详细</a>-->
                            </script>

                            <div class="layui-form-item">
                                <div class="layui-input-block">
                                    <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
                                    <!--<button type="reset" class="layui-btn layui-btn-primary">重置</button>-->
                                </div>
                            </div>
                        </form>
                    </div>
                </div>



                <div style="clear: both;"></div>
            </div>

            <!--弹出层-->
            <div class="layui-row" id="outline_edit_box"
                 style="display:none; position: absolute; top: 0; left: 0; bottom: 0; right: 0; ">
                <div class="layui-col-md11">
                    <div style="font-size: 14px; padding-top: 20px;">
                        <form  class="layui-form" lay-filter="editOutlineForm">
                            <div class="layui-form-item">
                                <input type="hidden" name="id" class="layui-input">
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">名称</label>
                                <div class="layui-input-block">
                                    <input type="text" name="name" required  lay-verify="required"
                                            placeholder="请输入标题" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">简介</label>
                                <div class="layui-input-block">
                                    <textarea name="intro" id="intro" placeholder="请输入内容" class="layui-textarea" style="height: 200px;"></textarea>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-input-block">
                                    <button class="layui-btn" lay-submit lay-filter="editOutlineSubmit">立即提交</button>
                                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
            <!--弹出层结束-->
        </div>
    </div>
</div>

<div th:include="/teacher/templates::footer"></div>
<script src="/vue/vue.js"></script>
<script src="/js/teacher/outline/index.js"></script>


</body>
</html>